<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <meta name="key/words" content="berbagi,charity,community"/>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link href="css/bootstrap.css" rel="stylesheet"/>   
        <link href="css/styleBerbagi.css" rel="stylesheet" type="text/css"/>   
        <title>Semua Berbagi-Indonesia Charity Community</title>  
    </head>
    <body>
        <div class="container">
            <div class="navbar navbar-default" role="navigation"> 
                <div class="container-fluid">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed togle_margin" data-toggle="collapse" data-target=".navbar-collapse"> 
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span> 
                            <span class="icon-bar"></span> 
                            <span class="icon-bar"></span> 
                        </button> 
                        <form class="navbar-form" role="search">
                            <div class="input-group">
                                <input type="text" class="form-control" placeholder="Search" name="text_search">
                                <div class="input-group-btn">
                                    <button class="btn btn-default" type="submit" name="button_search"><i class="glyphicon glyphicon-search"></i></button>
                                </div>
                            </div>
                        </form>
                    </div> 
                    <div class="navbar-collapse collapse"> 
                        <ul class="nav navbar-nav navbar-right"> 
                            <li>
                                <a href="#">Daftar</a>
                            </li>
                            <li>
                                <a href="#">Masuk</a>
                            </li> 
                        </ul> 
                    </div> 
                </div>
            </div>
            <div class="jumbotron utama">
                <div class="row">
                    <div class="col-sm-4 col-xs-12">
                        <img src="img/logo.png" class="img-responsive im"/>
                        <ul class="nav nav-pills nav-stacked menu">
                            <li>
                                <a href="#"><small>Our Mission</small></a>
                            </li>
                            <li>
                                <a href="#"><small>Donation</small></a>
                            </li>
                            <li>
                                <a href="#"><small>Help Children</small></a>
                            </li>
                            <li>
                                <a href="#"><small>Save The Earth</small></a>
                            </li>
                        </ul>
                    </div>
                    <div class="col-sm-8 col-xs-12">
                        <img src="img/peta.png" class="img-responsive im1"/>
                    </div>
                </div>
            </div>

            <div class="panel panel-default panelAtas">
                <div class="panel-body">
                    <div class="row">
                        <div class="col-sm-7 col-xs-12">
                            <img src="inspiratif/ins1.png" class="img-responsive im"/>
                        </div>
                        <div class="col-sm-5 col-xs-12">
                            <div class="panel panel-default panelIns">
                                <div class="panel-heading">
                                    <blockquote class="blockQuoteBerbagi">
                                        <div class="row">
                                            <div class="col-lg-5 col-sm-12 col-xs-12">
                                                Berbagi Hari Ini
                                            </div>
                                            <div class="col-lg-5 col-sm-12 col-xs-12 panelTgl">
                                                20-Agustus-2014
                                            </div>
                                        </div>  
                                    </blockquote>                              
                                </div>
                                <div class="panel-body">
                                    <div class="row">
                                        <div class="col-lg-8 col-sm-12 col-xs-12">
                                            <div class="well well-sm well-xs commentAtas">
                                                <p>
                                                    Lorem ipsum dolor sit amet, consectetuer adipiscing 
                                                    elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
                                                    Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper
                                                </p>
                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-sm-12 col-xs-12">
                                            <img src="foto/foto1.png" class="img-thumbnail fotoAtas"/>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-4 col-sm-12 col-xs-12">
                                            <img src="foto/foto2.png" class="img-thumbnail fotoBawah"/>
                                        </div>
                                        <div class="col-lg-8 col-sm-12 col-xs-12">
                                            <div class="well well-lg commentBawah">
                                                <p>
                                                    Lorem ipsum dolor sit amet, consectetuer adipiscing 
                                                    elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
                                                    Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="panel-footer">
                                    <div class="row">
                                        <div class="col-lg-5 col-sm-12 col-xs-12">
                                            <div class="btn-group im">
                                                <button type="button" class=" btn btn-default"><img class="img-responsive" src="img/facebook.png"/>Share</button>
                                                <button type="button" class=" btn btn-default"><img class="img-responsive" src="img/twitter.png"/>Tweet</button>
                                            </div>
                                        </div>
                                        <div class="col-lg-7 col-sm-12 col-xs-12">
                                            <ul class="pagination pagination-sm fotoAtas">
                                                <li><a href="#">&laquo;</a></li>
                                                <li><a href="#">1</a></li> 
                                                <li><a href="#">2</a></li> 
                                                <li><a href="#">3</a></li> 
                                                <li><a href="#">4</a></li> 
                                                <li><a href="#">5</a></li> 
                                                <li><a href="#">&raquo;</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="panel panel-default panelKat">
                <div class="panel-heading">
                    <blockquote class="blockQuoteBerbagi">
                        <label>Kategori Barang</label>
                    </blockquote>            
                </div>
                <div class="row">
                    <div class="col-sm-1 col-xs-3">

                    </div>
                    <div class="col-sm-2 col-xs-6">
                        <center><a href="#"><img src="kategori/1.png" class="img-thumbnail"/></a></center>
                    </div>
                    <div class="col-sm-2 col-xs-6">
                        <center><a href="#"><img src="kategori/2.png" class="img-thumbnail"/></a></center>
                    </div>
                    <div class="col-sm-2 col-xs-6">
                        <center><a href="#"><img src="kategori/3.png" class="img-thumbnail"/></a></center>
                    </div>
                    <div class="col-sm-2 col-xs-6">
                        <center><a href="#"><img src="kategori/4.png" class="img-thumbnail"/></a></center>
                    </div>
                    <div class="col-sm-2 col-xs-6">
                        <center><a href="#"><img src="kategori/5.png" class="img-thumbnail"/></a></center>
                    </div>
                    <div class="col-sm-1 col-xs-3">

                    </div>    
                </div>
            </div>

            <div class="panel panel-default panelKat">
                <div class="panel-heading">
                    <div class="row">
                        <div class="col-sm-6 col-xs-6">
                            <div class="row">
                                <div class="col-sm-6 col-xs-6">
                                    <div class="row">
                                        <div class="col-sm-6 col-xs-12">
                                            <a href="#">
                                                <button type="button" class="btn btn-default"><img src="img/facebook.png" class="img-responsive"/>Like</button>
                                            </a>
                                        </div>
                                        <div class="col-sm-6 col-xs-12">
                                            <span class="badge">3.8m</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-xs-6">
                                    <div class="row">
                                        <div class="col-sm-6 col-xs-12">
                                            <a href="#">
                                                <button type="button" class="btn btn-default"><img src="img/twitter.png" class="img-responsive"/>Follow</button>
                                            </a>
                                        </div>
                                        <div class="col-sm-6 col-xs-12">
                                            <span class="badge">140K followers</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6 col-xs-6">

                        </div>
                    </div>
                </div>

                <div class="row">

                    <div class="col-sm-1 col-xs-1">

                    </div>
                    <div class="col-sm-2 col-xs-12">
                        <center>
                            <div class="panel-body utama">
                                <img src="barang/1.jpg" class="img-thumbnail"/>
                                <h5 class="h5Title">Baju Cewek</h5><br><br>
                                <div class="row">
                                    <div class="col-sm-5 col-xs-3">
                                        <h5 class="h5Like"><a href="#">Like  <span class="badge">200</span></a></h5>
                                    </div>
                                    <div class="col-sm-7 col-xs-4">
                                        <h5 class="h5Comment"><a href="#">Comment  <span class="badge">150</span></a></h5>
                                    </div>
                                </div>
                                <br><br><br>
                                <ul class="list-group">
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                </ul>
                            </div>
                        </center>
                    </div>
                    <div class="col-sm-2 col-xs-12">
                        <center>
                            <div class="panel-body utama">
                                <img src="barang/1.jpg" class="img-thumbnail"/>
                                <h5 class="h5Title">Baju Cewek</h5><br><br>
                                <div class="row">
                                    <div class="col-sm-5 col-xs-3">
                                        <h5 class="h5Like"><a href="#">Like  <span class="badge">200</span></a></h5>
                                    </div>
                                    <div class="col-sm-7 col-xs-4">
                                        <h5 class="h5Comment"><a href="#">Comment  <span class="badge">150</span></a></h5>
                                    </div>
                                </div>
                                <br><br><br>
                                <ul class="list-group">
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                </ul>
                            </div>
                        </center>
                    </div>
                    <div class="col-sm-2 col-xs-12">
                        <center>
                            <div class="panel-body utama">
                                <img src="barang/1.jpg" class="img-thumbnail"/>
                                <h5 class="h5Title">Baju Cewek</h5><br><br>
                                <div class="row">
                                    <div class="col-sm-5 col-xs-3">
                                        <h5 class="h5Like"><a href="#">Like  <span class="badge">200</span></a></h5>
                                    </div>
                                    <div class="col-sm-7 col-xs-4">
                                        <h5 class="h5Comment"><a href="#">Comment  <span class="badge">150</span></a></h5>
                                    </div>
                                </div>
                                <br><br><br>
                                <ul class="list-group">
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                </ul>
                            </div>
                        </center>
                    </div>
                    <div class="col-sm-2 col-xs-12">
                        <center>
                            <div class="panel-body utama">
                                <img src="barang/1.jpg" class="img-thumbnail"/>
                                <h5 class="h5Title">Baju Cewek</h5><br><br>
                                <div class="row">
                                    <div class="col-sm-5 col-xs-3">
                                        <h5 class="h5Like"><a href="#">Like  <span class="badge">200</span></a></h5>
                                    </div>
                                    <div class="col-sm-7 col-xs-4">
                                        <h5 class="h5Comment"><a href="#">Comment  <span class="badge">150</span></a></h5>
                                    </div>
                                </div>
                                <br><br><br>
                                <ul class="list-group">
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                </ul>
                            </div>
                        </center>
                    </div>
                    <div class="col-sm-2 col-xs-12">
                        <center>
                            <div class="panel-body utama">
                                <img src="barang/1.jpg" class="img-thumbnail"/>
                                <h5 class="h5Title">Baju Cewek</h5><br><br>
                                <div class="row">
                                    <div class="col-sm-5 col-xs-3">
                                        <h5 class="h5Like"><a href="#">Like  <span class="badge">200</span></a></h5>
                                    </div>
                                    <div class="col-sm-7 col-xs-4">
                                        <h5 class="h5Comment"><a href="#">Comment  <span class="badge">150</span></a></h5>
                                    </div>
                                </div>
                                <br><br><br>
                                <ul class="list-group">
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                    <li class="list-group-item"></li>
                                </ul>
                            </div>
                        </center>
                    </div>
                    <div class="col-sm-1 col-xs-3">

                    </div> 
                </div>
            </div>
            <div class="panel panel-default panelKat">
                <div class="panel-footer panelKaki">
                    <div class="row">
                        <div class="col-sm-12 col-xs-12">
                            <br><br><br>
                            <center><label class="fontKaki"><h4>@ Copyright 2014 semua berbagi - All right reserved</h4></label></center>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script src="js/jquery.min.js"></script>
        <script src="js/bootstrap.js"></script>
    </body>
</html>
